import React, { Component } from 'react'
import styles from './index.less'
import {Icon} from 'antd'
import { connect } from 'dva'

@connect(({ setting, loading }) => ({ 
    globalState: setting.globalState
}))
class LinkStateView extends Component {

    state = {
        timeId: false
    }

    render() {
        const { globalState } = this.props
        let globalColor = globalState === '已连接' ? '#176B2C' : '#801919'
        //let ltColor = ltState === '已连接' ? '#176B2C' : '#801919'
        return (
            <div className = {styles.stateContent}>
                <div className = {styles.states}>网关连接状态：<Icon type="link" style={{ color: globalColor}}/> {globalState}</div>
                {/* <div className = {styles.states}>异网状态：<Icon type="link" style={{ color: ltColor}}/> {ltState}</div> */}
            </div>
        )
    }

    componentDidMount(){
        this.state.timeId = setInterval(()=>{
            const { dispatch } = this.props
            dispatch({
                type: 'setting/fetchSelState',
            })
        },1000)
    }

    componentWillUnmount() {
        clearInterval(this.state.timeId)
    }
}

export default LinkStateView